
extends ../share/layout

// 样式
block css
    link(rel='stylesheet', href="/js/plugins/editormd/editormd.css")
    link(rel="shortcut icon", href="https://pandao.github.io/editor.md/favicon.ico", type="image/x-icon")


// 面包屑
block crumb
  .col-sm-12
    ol.breadcrumb
      li
        a(href="/") Home
      li.active
        strong Editor of Markdown

// 页面主体内容
block content
  .row
    .col-lg-12
      input(type="button", value="Save.", onclick="Save();", class="btn btn-primary btn-sm")
      input(type="button", value="Get Markdown source code.", onclick="GetMD();", class="btn btn-info btn-sm")
      input(type="button", value="Get Textarea HTML source code.", onclick="GetHTML();", class="btn btn-info btn-sm")
      input(type="button", value="Get Preview HTML source code.", onclick="GetPreviewHTML();", class="btn btn-info btn-sm")
    .col-lg-12
      #test-editormd
        textarea(style="display:none;")

// 脚本
block scripts
  // script begin *********************

  script(src="/js/plugins/editormd/editormd.min.js")

  script.
    var testEditor = null;
    $(function(){
      testEditor = editormd("test-editormd", {
          width   : "100%",
          height  : 640,
          syncScrolling : "single",
          path    : "/js/plugins/editormd/lib/",
          saveHTMLToTextarea : true,
      });
      //var md = testEditor.getMarkdown();       // 获取 Markdown 源码
      //testEditor.getHTML();           // 获取 Textarea 保存的 HTML 源码
      //testEditor.getPreviewedHTML();  // 获取预览窗口里的 HTML，在开启 watch 且没有开启 saveHTMLToTextarea 时使用
    });

    function GetMD(){
      var a = testEditor.getMarkdown();
      alert(a);
    }
    function GetHTML(){
      var a = testEditor.getHTML();
      alert(a);
    }
    function GetPreviewHTML(){
      var a = testEditor.getPreviewedHTML();
      alert(a);
    }
    function Save(){

      var url = '/home/saveeditormd';
      var data = { "md": testEditor.getMarkdown(), "html": testEditor.getPreviewedHTML() };
      $.post(url, data, function (res) {
        if(res.code == 100){
          alert(res.value);
        }else{
          alert(res.msg);
        }
      }, 'json');

    }
        
  // script end *********************

